<head>
  <title>dnspod-docs</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>

<body>
    <div class="container-fluid">
      {{> main}}
      <hr>

      <footer>
        <p>&copy; DNSPod, Inc. 2012</p>
      </footer>

    </div><!--/.fluid-container-->

</body>

<template name="main">
  {{#unless editing_one_doc}}
    <div class="row-fluid">
      <div class="span2">
        <div class="well sidebar-nav">
          {{> lists}}
        </div><!--/.well -->
      </div><!--/span-->
      <div class="span10">
        {{> content}}
      </div><!--/span-->
    </div><!--/row-->
  {{else}}
    {{> edit_doc}}
  {{/unless}}
</template>

<template name="lists">
  <ul class="nav nav-list">
    <li class="nav-header">分类目录</li>
    {{#each lists}}
      {{> list_item}}
    {{/each}}
  </ul>
  <input type="text" class="add-list" placeholder="添加分类">
</template>

<template name="list_item">
  <li class="{{active}}"><a href="#{{name}}">{{name}}</a></li>
</template>


<template name="content">
  {{#if is_index}}
    {{> index}}
  {{/if}}
  {{#if is_search_result}}
    {{> search_result}}
  {{/if}}
  {{#if list_docs}}
    {{> docs}}
  {{/if}}
  {{#if opened_one_doc}}
    {{> view_doc}}
  {{/if}}
</template>

<template name="docs">
  <div class="btn-toolbar">
    <div class="btn-group">
      <a data-toggle="modal" href="#newdoc" class="btn btn-success"><i class="icon-plus icon-white"></i> New Doc</a>
    </div>
    <div class="btn-group">
      {{> search_bar}}
    </div>
    <div class="modal" id="newdoc" style="display:none">
      <div class="modal-header">
        <a href="#" class="close" data-dismiss="modal">×</a>
        <h3>写一个文档标题</h3>
      </div>
      <div class="modal-body">
        <input type="text" id="newDocName" placeholder="标题">
      </div>
      <div class="modal-footer">
        <button class="btn" data-dismiss="modal">Cancel</button>
        <button class="btn btn-primary new-doc-ok"><i class="icon-ok icon-white"></i> Ok</button>
      </div>
    </div>
  </div>
  {{> tag_filter}}
  <table class="table table-striped">
    <thead>
      <tr><th style="width:30%">Title</th><th style="width:50%">Tags</th><th style="width:20%">Last Modify</th></tr>
    </thead>
    <tbody>
      {{#each docs}}
        {{> doc_item}}
      {{/each}}
    </tbody>
  </table>
</template>

<template name="tag_filter">
  <div id="tag-filter" class="tag-list">
    {{#each tags}}
      {{> tag_item}}
    {{/each}}
  </div>
</template>


<template name="tag_item">
  <div class="tag {{selected}}">{{tag_text}} <span class="count">({{count}})</span></div>
</template>


<template name="index">
  <div class="hero-unit">
    <h1>DNSPod 文档中心 β1</h1>
    <p>Hi, 这里是 DNSPod 文档中心，方便共享文档，管理文档。目前是不删档测试，欢迎大家反馈 @chuangbo</p>
    <p>已有分类 {{lists}} 个，文档 {{docs}} 篇（含若干云剪贴板。。。</p>
    {{> search_bar}}
  </div>
  <div class="row-fluid">
    <div class="span4">
      <h2>实时</h2>
      <p>所有修改都即时反映在所有人的浏览器上，前所未有的帅呀，Awesome! </p>
      <p>由 <a href="http://www.meteor.com/">Meteorjs</a>、NodeJS、Backbonejs、Bootstrap、Handlebar、Underscore 强力驱动！</p>
    </div><!--/span-->
    <div class="span4">
      <h2>纯文本编辑</h2>
      <p>自从用了 Markdown 编辑文档，腰也不酸了，手也不疼了。</p>
      <p>用 Markdown 可以写出带格式的漂亮文档，而且写起来很简单哦，跟着 @chuangbo, 5分钟学会 Markdown.</p>
      <p><a class="btn" href="#文档系统教程/Markdown">5分钟学习 Markdown &raquo;</a></p>
    </div><!--/span-->
    <div class="span4">
      <h2>实时预览</h2>
      <p>双栏编辑，实时预览，爽阿～</p>
      <p>创意来自 <a href="http://mouapp.com">Mou</a></p>
    </div><!--/span-->
  </div><!--/row-->
  <div class="row-fluid">
    <div class="span4">
      <h2>分类</h2>
      <p>在左侧可以自由建立分类。As much as you wish. </p>
    </div><!--/span-->
    <div class="span4">
      <h2>多标签</h2>
      <p>给文档加注任意标签，可以按标签索引同类文档，快如闪电 </p>
      <p>创意来自 <a href="http://brettterpstra.com/project/nvalt/">nvAlt</a> </p>
    </div><!--/span-->
    <div class="span4">
      <h2>全文搜索</h2>
      <p>Coming soon.. </p>
    </div><!--/span-->
  </div><!--/row-->
</template>



<template name="doc_item">
  <tr>
    <td><a href="#{{path}}">{{title}}</a></td>
    <td>
      {{#each tag_objs}}
        {{> tag}}
      {{/each}}
      {{#if adding_tag}}
        <div class="tag edittag">
          <input type="text" id="edittag-input" value="" />
        </div>
      {{else}}
        <div class="tag new-tag">new tag</div>
      {{/if}}
    </td>
    <td>{{last_modify}}</td>
  </tr>
</template>

<template name="tag">
  <div class="tag"><span class="tag_name">{{tag}}</span> <span class="remove-tag">&times;</span></div>
</template>

<template name="view_doc">
  {{#with doc}}
    <div class="well">
      <div class="btn-toolbar" style="float:right;">
        <div class="btn-group">
          <a href="#{{path}}/edit" class="btn btn-small"><i class="icon-pencil"></i> Edit</a>
          <a data-toggle="modal" href="#removeDoc" class="btn btn-small"><i class="icon-remove"></i> Delete</a>
        </div>
      </div>

      <div class="modal" id="removeDoc" style="display:none">
        <div class="modal-header">
          <a href="#" class="close" data-dismiss="modal">×</a>
          <h3>删除文档</h3>
        </div>
        <div class="modal-body">
          删除文档无法恢复，确认要删除文档吗？
        </div>
        <div class="modal-footer">
          <button class="btn btn-danger delete-doc">Delete</button>
          <button class="btn" data-dismiss="modal">Cancel</button>
        </div>
      </div>

      <div class="github">
        {{#markdown}}{{{content}}}{{/markdown}}
      </div>
    </div>
  {{/with}}
</template>


<template name="edit_doc">
  {{#with doc}}
    <div class="btn-toolbar">
      <div class="btn-group">
        <button class="btn btn-primary save"><i class="icon-ok icon-white"></i> Save</button>
      </div>
      <div class="btn-group">
        <a href="#{{path}}" class="btn"><i class="icon-remove"></i> Cancel</a>
      </div>
    </div>
    <div class="row-fluid">
      <div class="span6">
        <textarea class="edit_doc_textarea">{{content}}</textarea>
      </div><!--/span-->
      <div class="span6">
        <div class="well github doc_preview">
          {{#markdown}}{{{content}}}{{/markdown}}
        </div>
      </div><!--/span-->
    </div><!--/row-->
  {{/with}}
</template>

<template name="edit_doc_preview">
    {{#markdown}}{{{content}}}{{/markdown}}
</template>

<template name="search_bar">
  <form class="form-search">
    <input type="text" class="input-medium search-query" placeholder="" value="{{query}}">
    <button type="submit" class="btn">搜索</button>
  </form>
</template>

<template name="search_result">
  {{> search_bar}}
  <table class="table table-striped">
    <thead>
      <tr><th style="width:30%">Title</th><th style="width:50%">Tags</th><th style="width:20%">Last Modify</th></tr>
    </thead>
    <tbody>
      {{#each docs}}
        {{> doc_item}}
      {{/each}}
    </tbody>
  </table>

</template>


